<template>
	<view class="content" :style="{'padding-top':top+'px','min-height':windowheight+'px'}">
		<Navbar title="我的收货地址" bgColor="#da708b" :backIcon="false" style="color: #ffffff;z-index: 1;"></Navbar>
		<view class="address_list" v-for="(item,index) in address_infos" :key="index">
			<view class="address_info">
				<view class="addressi_address">{{item.clientDeliveryAddressInfo}}
					<uni-tag :text="item.clientDeliveryTag"
						custom-style="margin-left:10rpx;border-radius: 10rpx;background-color: #D6F7D8;border:0rpx;padding-left:15rpx;padding-right:15rpx;color:#3E985A"
						type="primary" size="mini" />
					<uni-tag v-if="item.defaultAddress===true" text="默认"
						custom-style="margin-left:10rpx;border-radius: 10rpx;background-color: #FFF7D6;border:0rpx;padding-left:15rpx;padding-right:15rpx;color:#DBBB56"
						type="primary" size="mini" />
				</view>
				<view class="detailedAddress">{{item.clientDeliveryDetailedAddress}}</view>
				<view class="addressi_qt">
					<text class="addressiq_name">{{item.clientDeliveryName}}</text>
					<text class="addressiq_tel">{{hidePhoneNum(item.clientDeliveryPhone)}}</text>
				</view>
			</view>
			<view class="address_icon" @tap.stop="address_info('edit',index)">
				<uni-icons type="compose" size="20"></uni-icons>
			</view>
		</view>
		<view class="address_add">
			<button type="default" @click="address_info('add')">新增地址</button>
		</view>
	</view>
</template>
<script setup>
	import { ref,onMounted,reactive,computed } from 'vue'
	import {
		onShow,
		onLoad
	} from '@dcloudio/uni-app'
	const baseUrl = getApp().globalData.baseUrl
	const title=ref('Hello')
	const windowheight=ref()
	const platform = ref()
	const statusBar = ref()
	const customBar = ref()
	const top = ref()
	const address_infos = ref([])
	const address_info = (type, index) => {
		uni.navigateTo({
			url: "/pages/addressinfo/addressinfo?type=" + type + "&index=" + index
		})
	}
	const hidePhoneNum = computed(() => (num) => {
		return num.toString().slice(0, 3) + "****" + num.toString().slice(-4)
	})
	const getColumnHeight=()=>{
		uni.getSystemInfo({
			success(res) {
				console.log(res)
				platform.value = res.platform
				windowheight.value=res.screenHeight
				// #ifdef MP-WEIXIN
				statusBar.value = res.statusBarHeight
				const custom = wx.getMenuButtonBoundingClientRect()
				customBar.value = custom.bottom + custom.top - res.statusBarHeight
				// #endif
				// #ifdef APP-PLUS
				statusBar.value = res.statusBarHeight
				customBar.value = res.statusBarHeight + 45
				// 这里是在安卓手机上加上 3 像素（当时好像是在安卓水滴屏上，系统导航栏高度较低才加上去的，大家可以真机自己调试一下）
				if (res.platform == "android") {
					statusBar.value += 3
					customBar.value += 3
				}
				// #endif
			}
		})
		top.value = customBar.value
		windowheight.value=windowheight.value-top.value
		//console.log(statusBar.value, customBar.value, top.value,windowheight.value)
	}
	onShow(()=>{
		const now = new Date().getTime()
		if (!uni.getStorageSync('token') || now > uni.getStorageSync('expireTime')) {
			uni.reLaunch({
				url: "/pages/login/login"
			})
		}else{
			uni.request({
				url: getApp().globalData.baseUrl + "/delivery/list",
				method: "GET",
				header: {
					'content-type': 'application/json',
					'Access-Control-Allow-Origin': "*",
					'Authorization': uni.getStorageSync('token')
				},
				data: {
					clientNo: JSON.parse(uni.getStorageSync("user_info")).clientNo
				},
				success: (res) => {
					console.log(res)
					address_infos.value = res.data.value
					console.log(address_infos.value)
				},
				fail: (err) => {
					console.log(err)
				}
			})
		}
	})
	onMounted(()=>{
		getColumnHeight()
	})
</script>
<style scoped>
	.content {
		background-image: linear-gradient(to bottom,#d95e7d,#ffffff);
	}
	.address_list {
		display: flex;
		justify-content: space-between;
		align-items: center;
		border-bottom: 1px solid #666666;
		margin: 10rpx;
		padding: 10rpx;
	}
	
	.address_info {
		line-height: 50rpx;
	}
	
	.addressi_address {
		font-size: 30rpx;
		font-weight: bold;
	}
	
	.detailedAddress {
		font-size: 25rpx;
	}
	
	.addressi_qt {
		font-size: 26rpx;
		color: #666666;
	}
	
	.addressiq_tel {
		margin-left: 20rpx;
	}
	
	.address_add {
		margin-top: 40rpx;
	}
	
	.address_add button {
		background-color: #e77c90;
		width: 98%;
		color: #fff;
	}
	uni-tag{
		white-space: nowrap !important;
	}
</style>